<template>
  <div>
    <div class="layout-padding-auto layout-padding-view">
      <current-patient :patient-uid="patientUid" :doctor-uid="doctorUid"/>
      <div v-show="!showPatientCaseDetail">
        <abnormal-bp-record :patient-uid="patientUid"/>
        <blood-heart-rate :patient-uid="patientUid"/>
        <heart-rate :patient-uid="patientUid"/>
        <patient-case-list :patient-uid="patientUid" @change-show-patient-case-detail="changeShowPatientCaseDetail" @change-patient-case-obj="changePatientCaseObj" />
      </div>
      <div class="my-3" v-show="showPatientCaseDetail">
        <patient-case-detail @change-show-patient-case-detail="changeShowPatientCaseDetail" :patient-case-obj="patientCaseObj" />
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import CurrentPatient from './currentPatient.vue';
import AbnormalBpRecord from './abnormalBpRecord.vue';
import PatientCaseList from './PatientCaseList.vue';
import PatientCaseDetail from './PatientCaseDetail.vue';
import BloodHeartRate from './BloodHeartRate.vue';
import HeartRate from './HeartRate.vue';
import { useDoctorInfo } from "/@/stores/doctorInfo";
import { ref } from 'vue';

// 从路由中获取patientUid
const route = useRoute();
const queryParams = route.query;
const patientUid = <string>queryParams.patientUid;
const doctorUid = useDoctorInfo().doctorBaseInfo.doctorUid || null

const patientCaseObj = ref({});

const showPatientCaseDetail = ref<boolean | null>(false);

const changeShowPatientCaseDetail = (tmp: boolean) => {
  showPatientCaseDetail.value = tmp;
}

const changePatientCaseObj = (obj: any) => {
  patientCaseObj.value = obj;
}

</script>
